<template>
  <!-- 基本信息 唐美莉 -->
  <div>
    <div class="content-box">
      <h3>
        <div class="col-xs-6">基本信息</div>
        <div class="col-xs-6" style="text-align: right;">
          <el-link :underline="false" icon="el-icon-edit" @click="editInfo()" class="patient_edit">修改</el-link>
          <i class="glyphicon glyphicon-pencil" style="cursor: pointer;"></i>
        </div>
      </h3>
      <el-form ref="form" v-if="!dialogBasic" label-width="120px">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="姓名：">
              {{detail.name}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="性别：">
              {{detail.sex | toSex}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="出生年月：">
              {{detail.birthday}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="年龄：">
              <label v-if="detail.age>7">{{detail.age}}岁</label>
              <label v-if="detail.age<7">{{detail.age}}岁{{detail.sdfMonth?detail.sdfMonth:0}}月{{detail.sdfDay?detail.sdfDay:0}}天</label>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="手机号：">
              {{detail.mobile}}
            </el-form-item>
          </el-col>
          <!-- <el-col :span="12">
            <el-form-item label="来源：">
              {{patientsource | changePatientSource}}
            </el-form-item>
          </el-col> -->
          <el-col :span="12">
            <el-form-item label="身份证号：">
              {{detail.idCard}}
            </el-form-item>
          </el-col>
          <!-- <el-col :span="12">
            <el-form-item label="微信号：">
              {{detail.openId}}
            </el-form-item>
          </el-col> -->
          <el-col :span="12">
            <el-form-item label="籍贯：">
              {{detail.province}}{{detail.city}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="民族：">
              {{detail.nationId | changeAssist(mzList)}}
            </el-form-item>
          </el-col>
          <el-col :span="12" v-if="detail.age>18">
            <el-form-item label="婚姻状况：">
              {{detail.isMarried==0?'未婚':'已婚'}}
            </el-form-item>
          </el-col>
          <el-col :span="12" v-if="detail.age>18">
            <el-form-item label="职业：">
              {{detail.occupationId | changeAssist(zyList)}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="详细地址：">
              {{detail.address}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工作单位：">
              {{detail.workUnit}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="患者来源：">
              {{detail.source}}-{{detail.sourceName}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="就诊卡号：">
              {{detail.archivesCode}}
            </el-form-item>
          </el-col>
          <!-- <el-col :span="12">
            <el-form-item label="医保卡号：">
              {{detail.insuranceCardNumber}}
            </el-form-item>
          </el-col> -->
          <el-col :span="12">
            <el-form-item label="健康卡号：">
              {{detail.healthCard}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="标签：">
              <el-tag style="margin-right:5px;display:inline-block;" v-for="(it,index) in detail.labelIds" :key="index">
                {{it | changeAssist(labelList)}}
              </el-tag>
            </el-form-item>
          </el-col>
          <!-- <el-col :span="12">
            <el-form-item label="备注：">
              {{detail.remark}}
            </el-form-item>
          </el-col> -->
        </el-row>
      </el-form>
      <!-- <table v-if="!dialogBasic" border="0" class="table-box" width="100%">
        <tr height="40">
          <td>姓名：</td>
          <td>{{detail.name}}</td>
          <td>性别：</td>
          <td>{{detail.sex | toSex}}</td>
        </tr>
        <tr height="40">
          <td>出生年月：</td>
          <td>{{detail.birthday}}</td>
          <td>年龄：</td>
          <td>
            <label v-if="detail.age>7">{{detail.age}}岁</label>
            <label v-if="detail.age<7">{{detail.age}}岁{{detail.sdfMonth}}月{{detail.sdfDay}}天</label>
          </td>
        </tr>
        <tr height="40">
          <td>手机号：</td>
          <td>{{detail.mobile}}</td>
          <td>来源：</td>
          <td>{{patientsource | changePatientSource}}</td>
        </tr>
        <tr height="40">
          <td>身份证号：</td>
          <td>{{detail.idCard}}</td>
          <td>微信号：</td>
          <td>{{detail.openId}}</td>
        </tr>
        <tr height="40">
          <td>籍贯：</td>
          <td>{{detail.province}}</td>

          <td>民族：</td>
          <td>{{detail.nationId | changeAssist(mzList)}}</td>
        </tr>
        <tr v-if="detail.age>18" height="40">
          <td>婚姻状况：</td>
          <td>{{detail.isMarried==0?'未婚':'已婚'}}</td>
          <td>职业：</td>
          <td>{{detail.occupationId | changeAssist(zyList)}}</td>
        </tr>
        <tr height="40">
          <td>现住址：</td>
          <td>{{detail.address}}</td>
          <td>工作单位：</td>
          <td>{{detail.workUnit}}</td>
        </tr>
        <tr height="40">
          <td>就诊卡号：</td>
          <td>{{detail.archivesCode}}</td>
          <td>医保卡号：</td>
          <td>{{detail.insuranceCardNumber}}</td>
        </tr>
      
        <tr height="40">
          <td>标签：</td>
          <td>
            <el-tag style="margin-right:5px;display:inline-block;" v-for="(it,index) in detail.labelIds" :key="index">
              {{it | changeAssist(labelList)}}
            </el-tag>
          </td>
          <td>备注：</td>
          <td>{{detail.remark}}</td>
        </tr>
      </table> -->
      <basic v-if="dialogBasic" v-model="dialogBasic" :detail="detail" @success="findUsUserById"></basic>
    </div>
    <div class="content-box">
      <el-row class="title">
        <el-col :span="12">病史信息</el-col>
        <el-col :span="12" style="text-align: right;">
          <el-link :underline="false" icon="el-icon-edit" @click="editPersonal()" class="patient_edit">修改</el-link>
          <i class="glyphicon glyphicon-pencil" style="cursor: pointer;"></i>
        </el-col>
      </el-row>
      <el-form ref="form" v-if="!ispersonal" label-width="120px">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="个人史：">
              {{personForm.personalHistory}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="家族史：">
              {{personForm.familyHistory}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="既往史：">
              <label>{{personForm.pastHistory}}</label>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="疫苗接种史：">
              <label>{{personForm.seedlingsHistory}}</label>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="经带胎产史：">
              <label>{{personForm.afterTheBirth}}</label>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="过敏史：">
              <label style="margin-right:10px" v-for="(i,index) in item" v-if="i.allergens!='' || i.allergicReaction!='' || i.allergicDegree!=''" :key="index">{{i.allergens}}/{{i.allergicReaction}}/{{i.allergicDegree}}</label>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <!-- <table v-if="!ispersonal" border="0" class="table-box" width="100%">
        <tr height="40">
          <td>个人史：</td>
          <td>{{personForm.personalHistory}}</td>
          <td>家族史：</td>
          <td>{{personForm.familyHistory}}</td>
        </tr>
        <tr>
          <td>
            既往史：
          </td>
          <td>
            <label>{{personForm.pastHistory}}</label>
          </td>
        </tr>
        <tr>
          <td>疫苗接种史：</td>
          <td>
            <label>{{personForm.seedlingsHistory}}</label>
          </td>
        </tr>
        <tr height="40">
          <td>过敏史：</td>
          <td>
            <label style="margin-right:10px" v-for="(i,index) in item" v-if="i.allergens!='' || i.allergicReaction!='' || i.allergicDegree!=''" :key="index">{{i.allergens}}/{{i.allergicReaction}}/{{i.allergicDegree}}</label>
          </td>
        </tr>

      </table> -->
      <!-- 编辑过敏史 -->
      <personal v-if="ispersonal" v-model="ispersonal" :patientId="detail.patientId" :type="0" :detail="detail" :personForm="personForm" :item="item" @success="findUsUserById" @get="getPatientHistoryById" @cancel="editPersonal"></personal>
    </div>
    <div class="content-box">
      <el-row class="title">
        <el-col :span="12">其他信息</el-col>
        <el-col :span="12" style="text-align: right;">
          <el-link :underline="false" icon="el-icon-edit" @click="editExam" class="patient_edit">修改</el-link>
          <i class="glyphicon glyphicon-pencil" style="cursor: pointer;"></i>
        </el-col>
      </el-row>

      <el-form ref="form" v-if="!dialogExam" label-width="120px">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="身高：">
              {{signForm.height}}CM
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="体重：">
              {{signForm.weight}}KG
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="血型：">
              {{signForm.bloodTypeOne | changeAssist(blood)}}-{{signForm.bloodTypeTwo| changeAssist(bloodType)}}
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="BMI指数：">
              {{signForm.bmi}}
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <!-- <table border="0" class="basic_table" v-if="!dialogExam" width="100%">
          <tr height="40">
            <td>身高：</td>
            <td>{{signForm.height}}CM</td>
            <td>体重：</td>
            <td>{{signForm.weight}}KG</td>
          </tr>
          <tr height="40">
            <td>血型：</td>
            <td>{{signForm.bloodTypeOne | changeAssist(blood)}}-{{signForm.bloodTypeTwo| changeAssist(bloodType)}}</td>
            <td>BMI指数：</td>
            <td>{{signForm.bmi}}</td>
          </tr>
        </table> -->
      <examination v-model="dialogExam" v-if="dialogExam" :signForm="signForm" :bloodType="bloodType" :blood="blood" :detail="detail" :patientId="detail.patientId" @success="findUsUserById" @get="getPatientHistoryById"></examination>
    </div>
    <div class="content-box">
      <el-row class="title">
        <el-col :span="12">家庭成员</el-col>
        <el-col :span="12" style="text-align: right;">
          <i class="glyphicon glyphicon-pencil" style="cursor: pointer;"></i>
        </el-col>
      </el-row>
      <table border="0" v-for="(item,index) in patientRelationList" :key="index" class="basic_table" width="100%">
        <tr height="40">
          <td>{{item.relation | changeAssist(familyList)}}</td>
          <td></td>
          <td></td>
          <td style="text-align: right;">
            <el-link icon="el-icon-edit" :underline="false" @click="addRelation(item,'edit')" class="patient_edit">修改</el-link>
            <el-link icon="el-icon-delete" style="margin-right:10px;" :underline="false" @click="delFmaily(item)">删除</el-link>
          </td>
        </tr>
        <tr height="40">
          <td>姓名：</td>
          <td>{{item.name}}</td>
          <td>出生年月日：</td>
          <td>{{item.birthday}}</td>
        </tr>
        <tr height="40">
          <td>性别：</td>
          <td>{{item.sex | toSex}}</td>
          <td>年龄：</td>
          <td>
            <span v-if="item.age>18">{{item.age}}</span>
            <span v-else>{{item.birthday|toTimeContrast}}</span>
          </td>
        </tr>
        <tr height="40">
          <td>手机号：</td>
          <td>{{item.mobile}}</td>
          <td>微信号：</td>
          <td>{{item.openId}}</td>
        </tr>
        <!-- <tr height="40">
            <td>身份证号：</td>
            <td>{{item.idCard}}</td>
            <td>地址：</td>
            <td>{{item.openId}}</td>
          </tr> -->
      </table>
      <el-row class="add_patient_box">
        <el-col :span="8">
          <el-button @click="addRelation(detail,'add')" icon="el-icon-plus">
            添加家庭成员
          </el-button>
        </el-col>
      </el-row>
    </div>
    <add v-model="dialogRelation" v-if="dialogRelation" :detail="detail" :curItem="curItem" :type="type" @success="getPatientRelationList"></add>
  </div>
</template>
<script>
export default {
  props: ["detail", "ispersonal"],
  name: "visitInfo",
  data() {
    return {
      mzList: [],
      zyList: [],
      personForm: {
        isAllergic: 2, //是否过敏
        personalHistory: "", //个人史
        familyHistory: "", //家族史
        pastHistory: "", //既往史
        afterTheBirth:'',//经带胎产史
        seedlingsHistory: "", //疫苗接种史
        isDeleted: 0 //0有效1删除
      },
      patientsource: "",
      curItem: null,
      type: "",
      signForm: {
        weight: "",
        height: "",
        bmi: "",
        bloodTypeOne: "",
        bloodTypeTwo: "",
        isDeleted: 0,
        patientId: "",
        temperatureType: "",
        temperature: "",
        breathing: "",
        systolicPressure: "",
        diastolicpressure: "",
        bloodsugarType: "",
        bloodsugar: "",
        leftEye: "",
        rightEye: "",
        oxygenSaturation: "",
        painScore: "",
        pulse: "",
        status: 0
      },
      blood: [],
      bloodType: [],
      labelList: [],
      patientRelationList: [],
      familyList: [],
      dialogExam: false,
      item: [],
      dialogRelation: false,
      dialogBasic: false
    };
  },
  created() {
    let th = this;
    th.getBasicData();
    th.getPatientHistoryById();
    th.getPatientRelationList();
  },
  mounted() {
    let th = this;
    th.getPatientSource();
    // th.changeProvinceInfo();
  },
  methods: {
    getPatientSource() {
      let th = this;
      let uid = th.jieMi(th.$route.query.id);
      th.$api
        .getPatientSource({ patientId: uid, hpId: th.adminUser.hpId })
        .then(res => {
          if (res.executed) {
            if(res.patientSource){
              th.patientsource = res.patientSource.sourceId;
            }
          }
        });
    },
    changeProvinceInfo() {
      let th = this;
      let str = "";
      th.$api.findCoreRegionAll(th.detail.provinceId, th.detail.provinceId)
        .then(res => {
          if (res.status == 1) {
            th.$set(th.detail, "name1", res.districts[0].name);
          }
        });
    },
    getBasicData() {
      let th = this;
      th.getCommonConfigByKey("民族").then(res => {
        th.mzList = res;
      });
      th.getCommonConfigByKey("职业").then(res => {
        th.zyList = res;
      });
    },
    //历史病历
    getPatientHistoryById() {
      let th = this;
      th.$api
        .getPatientHistoryById({ patientId: th.detail.patientId })
        .then(res => {
          if (res.executed) {
            th.personForm = Object.assign(th.personForm, res.patientHistory);
          } else {
            //  th.$message.error(res.message)
          }
        });
      th.$api.getAllergyById({ patientId: th.detail.patientId }).then(res => {
        if (res.executed) {
          if (res.patientAllergyList != undefined) {
            if (res.patientAllergyList.length > 0) {
              th.personForm.isAllergic = 1;
              th.item = res.patientAllergyList;
            }
          }
        } else {
          th.$message.error(res.message);
        }
      });
      th.$api
        .getPatientSignById({ patientId: th.detail.patientId })
        .then(res => {
          if (res.executed) {
            th.signForm = Object.assign(th.personForm, res.patientSign);
          } else {
            //  th.$message.error(res.message)
          }
        });
      th.getCommonConfigByKey("血型").then(res => {
        th.blood = res;
      });
      th.getCommonConfigByKey("血型2").then(res => {
        th.bloodType = res;
      });
      th.getCommonConfigByKey("患者关系").then(res => {
        th.familyList = res;
      });
      th.$api
        .selectLabelEmunList({
          pageSize: 1000,
          pageNum: 1,
          hpId: th.adminUser.hpId
        })
        .then(res => {
          if (res.executed) {
            th.labelList = res.dataBody.list;
          } else {
            th.$message.error(res.message);
          }
        });
    },
    editInfo() {
      let th = this;
      th.dialogBasic = !th.dialogBasic;
    },
    //修改个人史
    editPersonal() {
      this.$emit("edit");
    },
    //修改体检
    editExam() {
      this.dialogExam = true;
    },
    findUsUserById() {
      this.$emit("success");
    },
    //家庭成员
    getPatientRelationList() {
      let th = this;
      th.$api
        .getPatientRelationList({ patientId: th.detail.patientId, status: 1 })
        .then(res => {
          if (res.executed) {
            th.patientRelationList = res.patientRelationList;
          }
        });
    },
    addRelation(obj, type) {
      let th = this;
      th.dialogRelation = true;
      th.curItem = obj;
      th.type = type;
    },
    //删除
    delFmaily(obj) {
      let th = this;
      th.$confirm(`确定删除吗?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        center: true
      }).then(() => {
        let j = { patientId: obj.patientId };
        th.showLoading();
        th.$api.deletePatientRelation(j).then(res => {
          if (res.executed) {
            th.$message.success("删除成功");
            //th.$emit("success");
            th.getPatientRelationList();
            th.showLoading(false);
          } else {
            th.$message.error(res.message);
            th.showLoading(false);
          }
        });
      });
    }
  },
  components: {
    personal: () => import("../_child/personal"),
    examination: () => import("../_child/examination"),
    add: () => import("../_com/addFamily"),
    basic: () => import("../_child/basicInfo")
  },
  filters: {}
};
</script>
<style lang="scss" scoped>
@import "../_css/detail.scss";
.add_patient_box {
  padding: 20px;
  border-left: 1px solid #eee;
  border-right: 1px solid #eee;
  border-bottom: 1px solid #eee;
  .btn-add {
    width: 100%;
  }
}
.patient_edit {
  margin-right: 10px;
}
.content-box {
  border: none;
}
.content-box table {
  border: none;
}
.visit_detail_box .content-box .title {
  background: none;
  padding-left: 0;
}
.el-form-item {
  margin-bottom: 10px;
}
</style>

